
import React , {Component} from "react"
import { Switch,Button } from 'antd';
import Head from "../../components/head"
import banner1 from "../../../assets/images/1.jpg"
import {secondsFormatYear} from "../../utils/common.js"
import {change_hot} from "../../actions"
import {connect} from "react-redux"
import { Tabs, WhiteSpace } from 'antd-mobile';
// import { StickyContainer, Sticky } from 'react-sticky';
  const tabs = [
    { title: '热门活动' },
    { title: 'beauty家' },
  ];
@connect(
    state=>({
        hots:state.hots,
    })
)
export default class Recommend extends Component{
    constructor(props){
        super(props)
    }
    componentWillMount(){
        const {dispatch}=this.props;
        dispatch(change_hot("/hot",dispatch));
    }
    render(){
        const {history} = this.props;
        var items;
        if(this.props.hots!=""){
        //  console.log(this.props.hots)
          items=  this.props.hots.map((item,idx)=>{
            var times=secondsFormatYear(item.dateline*1000,"yyyy-MM-dd")
            return (
                    <div className="recommendPic" key={idx}>
                        <div className="recommendImg">
                            <img src={item.bpic}/>
                        </div>
                        <div className="mengceng">
                            <h2>{item.subject}</h2>
                            <div className="mengcengfoot clearfix">
                                <img src={item.avatar} alt=""/>
                                <span className="mengcengword">{item.username}</span>
                                <span className="mengcengTime">
                                    <i className="iconfont icon-shizhong"></i>
                                    {times}
                                </span>
                            </div>
                        </div>
                    </div>
            )
            })
        }
        return (
           <div className="recommend">
                <Head/>
                <Tabs tabs={tabs}>
                    <div>
                        {items}
                    </div>
                    <div>
                        {items}
                    </div>
                </Tabs>
                
           </div>
        )
    }
}